<template>
	<view>
		<view class="nav-wrap" :style="{ background: 'rgba(255,255,255,0)' }">
			<uni-nav-bar statusBar leftIcon="left" title="登录/注册" color="#1E2124" background-color="rgba(255,255,255,0)"
				:border="false"></uni-nav-bar>
		</view>
		<view class="top-wrap">
			<uni-status-bar></uni-status-bar>
			<yf-clear-bar></yf-clear-bar>
			<image src="/static/commen/logo.png" class="logo" mode=""></image>
			<view class="logotext">
				数健云学习天地
			</view>
		</view> 
		<!-- <view class="text-center text-#aaa mt-24rpx text-xs">
			未注册手机号，将为您注册新的账号，并直接登陆（获取您的手机号授权用于注册账号，方便您更好的体验）
		</view> -->
		<button class="login-btn yf-flex-center" type="primary" open-type="getPhoneNumber"
			@getphonenumber="getPhoneNumber" v-if="radioValue">手机号授权登录</button>
		<button class="login-btn yf-flex-center" type="primary" @click="getPhoneNumber" v-else>手机号授权登录</button>
		<view class="bottom-wrap yf-flex-center">
			<image :src="`/static/evolution/redio_${radioValue?'on':'off'}.png`" mode="" @click="radioValue=!radioValue"
				class="radioImg"></image>
			<view class="bottom-text">
				阅读并同意<text
					@click="skip('webView',{url:'https://data-center.scrmzk.com/pages/privacyPage/privacyPage'})">《法律声明及隐私政策》</text>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		mapMutations,
		mapState
	} from 'vuex';
	export default {
		data() {
			return {
				redirect: '',
				radioValue: false
			};
		},
		onLoad(options) {

			let that = this
			const {
				redirect
			} = options
			if (redirect) {
				that.redirect = redirect
			}
		},
		methods: {
			...mapMutations(['SET_USERINFO', 'SET_TOKEN']),
			skip(url, data) {
				this.$Router.navigateTo(url, data)
			},
			redirectTo() {
				uni.navigateBack()
				const _redirect = this.redirect;
				if (_redirect === 'navigateBack') {
					// const prePage = this.$api.prePage()
					if (getCurrentPages().length > 1) {
						this.$Router.navigateBack();
					} else {
						this.$Router.switchTab('tabBar-index');
					}
				} else if (_redirect === 'navigateBack2') {
					this.$Router.navigateBack(2);
				} else if (_redirect && (_redirect.indexOf('/') > -1 || _redirect.indexOf('%2F') > -1)) {
					let _url = _redirect;
					// #ifdef MP-WEIXIN
					_url = decodeURIComponent(_redirect);
					// #endif
					this.$Router.redirectTo(_url);
				} else {
					this.$Router.switchTab('tabBar-index');
				}
			},
			imInitWx(i) {
				console.log('im登录')
				let that = this;
				console.log(that.$apis)

				that.$apis.generateUserId({
					userId: i
				}).then((res) => {
					console.log(res)
					uni.setStorageSync('userSig', res.msg)
					TUILogin.login({
							SDKAppID: uni.$SDKAppID,
							userID: i,
							userSig: res.msg,
							useUploadPlugin: true, // If you need to send rich media messages, please set to true.
							framework: `vue${uni.$vueVersion}`, // framework used vue2 / vue3
						})
						.then((s) => {
							console.log(s)
						})
						.catch((res) => {
							console.log(res)
						})
				}).catch((res) => {
					console.log(res)
				})
			},
			getPhoneNumber(res) {
				//
				let that = this;
				if (!this.radioValue) {
					this.$api.msg('请先勾选法律声明及隐私政策')
					return
				}
				console.log(res)
				uni.showLoading({
					title: '加载中',
					mask: true
				});
				uni.login({
					provider: 'weixin',
					success: function(loginRes) {
						console.log('-------获取code-------');
						console.log(loginRes.code);
						console.log(loginRes, "loginRes");
						that.$apis.getOpenid({
							code: loginRes.code
						}).then((data) => {
							that.$apis.loginApplet({
								code: res.detail.code,
								userId: data?.data?.userId
							}).then(result => {
								let _data = result;
								console.log(_data);
								if (_data.code == 200 && _data.data.token) {
									that.SET_TOKEN(_data.data.token);
									that.getUserInfo() //获取用户信息  
								}
							}).catch(err => {

							});
						}).catch(err => {

						});
					}
				});
			},
			getUserInfo() {
				let that = this
				that.$apis.getUserInfo().then(result => {
					let res = result;
					if (res.code == 200) {
						this.SET_USERINFO(res.data)
						that.redirectTo(); //跳转 
					}
				}).catch(err => {});
			}
		}
	}
</script>

<style lang="scss">
	page {
		background: #FFFFFF;
	}

	.nav-wrap {
		position: fixed;
		top: 0;
		left: 0;
		z-index: 22;
		width: 100%;
	}

	.text-center {
		margin: 20rpx;
		font-size: 28rpx;
		color: #74777f;
	}
	.top-wrap{ 
		background: linear-gradient( 0, #ffffff 0%, #e1f9f0 100%);
		padding-bottom: 60rpx;
	}
	.logo {
		width: 190rpx;
		height: 190rpx;
		margin: 144rpx auto 0;
		display: block;
	}

	.logotext {
		font-size: 36rpx;
		color: #1B2125;
		text-align: center;
	}

	.login-btn {
		margin: 80rpx auto;
		width: 630rpx;
		height: 100rpx;
		background: linear-gradient(90deg, #8CDF84 0%, #25CCAF 100%);
		border-radius: 50rpx;
		font-size: 32rpx;
		color: #FFFFFF;
		font-weight: bold;
	}

	.bottom-wrap {
		position: fixed;
		bottom: 80rpx;
		left: 0;
		width: 100%;

		.radioImg {
			width: 30rpx;
			height: 30rpx;
			margin-right: 10rpx;
		}

		.bottom-text {
			font-size: 28rpx;
			color: #A3A8B4;

			text {
				color: #45474B;
				font-size: 28rpx;
			}
		}
	}
</style>